/*
 * @Author: huangtianyang 916072572@qq.com
 * @Date: 2024-03-28 18:26:02
 * @LastEditors: huangtianyang
 * @LastEditTime: 2024-04-29 14:22:06
 * @FilePath: \cxl-driving-training\src\views\siteManagement\edit\index.ts
 */
import { PropsFormpData, fileListProps, fileProps, formDataInterface } from '@/utils/interface'
import { reactive, ref, watchEffect } from 'vue'
import { twoListConfig } from './twoConfig'
import { threeListConfig } from './threeConfig'
import { useRoute } from 'vue-router'
import { routerStore } from '@/store/router.store'
import { ElMessage } from 'element-plus'
import router from '@/router'
import { storage } from '@/store/sessionStorage'
import { userStore } from '@/store/user.store'
import { createSite, editSite, siteDetailedById, siteInterface } from '@/apis/siteConfig'
import { classTagListInterface } from '@/apis/class'
import { addDisplayBlockToImages } from '@/utils'
export default class DrivingSchoolOperation {
    twoFormData = reactive<PropsFormpData[]>([...twoListConfig])
    threeFormData = reactive<PropsFormpData[]>([...threeListConfig])
    subjectList = reactive(['科目二场地', '科目三场地'])
    selectSubjectName = ref('科目二场地')
    //编辑类型 create | edit | look
    operation = reactive({
        type: 'create',
        id: '',
        twoId: '',
        threeId: '',
        siteType: '0'
    })
    routerStore = routerStore()
    uStore = userStore()
    constructor() {
        const route = useRoute()
        this.operation.type = route.query.type as string
        this.operation.id = route.query?.id as string
        this.operation.siteType = route.query?.siteType as string

        this.selectSubjectName.value = this.operation.siteType === '2' ? '科目二场地' : '科目三场地'

        if (this.operation.type === 'create') {
            //初始化数据
        } else {
            this.getData()
        }

        const options: { label: string; value: string }[] = []
        this.uStore.queryDrivingSchoolSimple((res: Map<string, any>) => {
            res.forEach(item => {
                options.push({ label: item.shortName, value: item.id })
            })

            this.twoFormData.forEach((item: PropsFormpData, index: number) => {
                if (Object.prototype.toString.call(item) === '[object Array]' && index === 0) {
                    const childList = item as formDataInterface[]
                    childList[0].options = options
                }
            })
            this.threeFormData.forEach((item: PropsFormpData, index: number) => {
                if (Object.prototype.toString.call(item) === '[object Array]' && index === 0) {
                    const childList = item as formDataInterface[]
                    childList[0].options = options
                }
            })
        })

        watchEffect(() => {
            if (this.selectSubjectName.value === '科目二场地') {
                this.twoFormData.forEach((item: PropsFormpData, index: number) => {
                    if (Object.prototype.toString.call(item) === '[object Array]' && index === 0) {
                        const childList = item as formDataInterface[]
                        this.threeFormData.forEach((d: PropsFormpData, index: number) => {
                            if (Object.prototype.toString.call(d) === '[object Array]' && index === 0) {
                                const e = d as formDataInterface[]
                                e[0].value = childList[0].value
                                console.log(e[0])
                            }
                        })
                    }
                })
            }
            if (this.selectSubjectName.value === '科目三场地') {
                this.threeFormData.forEach((item: PropsFormpData, index: number) => {
                    if (Object.prototype.toString.call(item) === '[object Array]' && index === 0) {
                        const childList = item as formDataInterface[]
                        this.twoFormData.forEach((d: PropsFormpData, index: number) => {
                            if (Object.prototype.toString.call(d) === '[object Array]' && index === 0) {
                                const e = d as formDataInterface[]
                                e[0].value = childList[0].value
                            }
                        })
                    }
                })
            }
        })
    }
    getData = (arg?: any) => {
        siteDetailedById(this.operation.id).then((res: any) => {
            if (Number(res.data.code) === 200) {
                const result = res.data.result
                this.operation.twoId = result.trainSiteTwoDetail.id
                this.operation.threeId = result.trainSiteThreeDetail.id
                this.twoFormData.forEach((child: PropsFormpData) => {
                    if (Object.prototype.toString.call(child) === '[object Array]') {
                        const childList = child as formDataInterface[]
                        childList.forEach((item: formDataInterface) => {
                            console.log('twoRef', item)
                            if (item.key === 'addressDetail') {
                                const latLng: number[] = [result.trainSiteTwoDetail.lat, result.trainSiteTwoDetail.lng]
                                item.latLng = latLng
                                item.value = result.trainSiteTwoDetail.addressDetail
                                item.regionId = result.trainSiteTwoDetail.regionId
                            } else if (item.key === 'name') {
                                item.value = result.trainSiteTwoDetail.name
                            } else if (item.key === 'schoolId') {
                                item.value = result.schoolId
                            } else if (item.key === 'equipmentIntroduction') {
                                item.value = result.trainSiteTwoDetail.equipmentIntroduction
                            } else if (item.key === 'openHours') {
                                item.value = result.trainSiteTwoDetail.openHours
                            } else if (item.key === 'ownFlag') {
                                item.value = result.trainSiteTwoDetail.ownFlag + ''
                            } else if (item.key === 'siteType') {
                                item.value = result.trainSiteTwoDetail.siteType + ''
                            } else if (item.key === 'siteMating') {
                                item.value = result.trainSiteTwoDetail.supportFacility as string[]
                            } else if (item.key === 'siteVideo') {
                                const imageArray: fileProps[] = []
                                const videoArray: fileProps[] = [
                                    {
                                        index: Number(item.imageCount),
                                        tag: '',
                                        type: 'video',
                                        list: []
                                    }
                                ]

                                result.trainSiteTwoDetail.sitePic.forEach((f: any, index: number) => {
                                    imageArray.push({
                                        index,
                                        tag: f.tag,
                                        type: 'image',
                                        list: [
                                            {
                                                key: f.pic,
                                                name: f.tag
                                            }
                                        ]
                                    })
                                })
                                result.trainSiteTwoDetail.siteVideo.forEach((f: any, index: number) => {
                                    if (f.cover) {
                                        videoArray[0].list.push({
                                            key: f.cover,
                                            name: f.tag,
                                            type: 'image'
                                        })
                                        videoArray[0].list.push({
                                            key: f.video,
                                            name: f.tag,
                                            type: 'video'
                                        })
                                    }
                                })

                                item.value = new Array(Number(item.imageCount) + Number(item.videoCount))
                                item.value.splice(0, imageArray.length, ...imageArray)
                                item.value.splice(Number(item.imageCount), videoArray.length, ...videoArray)
                            }
                        })
                    }
                })
                this.threeFormData.forEach((child: PropsFormpData) => {
                    if (Object.prototype.toString.call(child) === '[object Array]') {
                        const childList = child as formDataInterface[]
                        childList.forEach((item: formDataInterface) => {
                            if (item.key === 'addressDetail') {
                                const latLng: number[] = [
                                    result.trainSiteThreeDetail.lat,
                                    result.trainSiteThreeDetail.lng
                                ]
                                item.latLng = latLng
                                item.value = result.trainSiteThreeDetail.addressDetail
                                item.regionId = result.trainSiteThreeDetail.regionId
                            } else if (item.key === 'name') {
                                item.value = result.trainSiteThreeDetail.name
                            } else if (item.key === 'schoolId') {
                                item.value = result.schoolId
                                console.log('result.schoolId', result.schoolId)
                            }

                            console.log('threeRef', item)
                        })
                    }
                })
            }
        })
    }

    //监听选择的月份
    onMonthChange = (res: any) => {}
    //取消创建
    onCancel = () => {
        this.routerStore.removeHeaderRoute(this.routerStore.selectIndex)
        router.push('/siteManagement-list')
    }
    //保存
    onSave = (twoRef: any, threeRef: any) => {
        let pass = false

        if (this.selectSubjectName.value === '科目二场地') {
            pass = twoRef?.validateForm() && threeRef?.validateForm()
        } else {
            pass = threeRef?.validateForm() && twoRef?.validateForm()
        }

        if (pass) {
            const data: siteInterface = {
                schoolId: '',
                trainSiteThree: {
                    addressDetail: '',
                    lat: 0,
                    lng: 0,
                    name: '',
                    regionId: ''
                },
                trainSiteTwo: {
                    addressDetail: '',
                    equipmentIntroduction: '',
                    lat: 0,
                    lng: 0,
                    name: '',
                    openHours: '',
                    ownFlag: 0,
                    regionId: '',
                    sitePic: [],
                    siteType: 0,
                    siteVideo: [],
                    supportFacility: []
                }
            }
            this.twoFormData.forEach((child: PropsFormpData) => {
                if (Object.prototype.toString.call(child) === '[object Array]') {
                    const childList = child as formDataInterface[]
                    childList.forEach((item: formDataInterface) => {
                        console.log('twoRef', item)
                        if (item.key === 'schoolId') {
                            data.schoolId = item.value as string
                        } else if (item.key === 'name') {
                            data.trainSiteTwo.name = item.value as string
                        } else if (item.key === 'addressDetail') {
                            data.trainSiteTwo.addressDetail = item.value as string
                            const latLng = item.latLng as number[]
                            data.trainSiteTwo.lat = Number(latLng[0])
                            data.trainSiteTwo.lng = Number(latLng[1])
                            data.trainSiteTwo.regionId = item.regionId as string
                        } else if (item.key === 'openHours') {
                            data.trainSiteTwo.openHours = item.value as string
                        } else if (item.key === 'equipmentIntroduction') {
                            data.trainSiteTwo.equipmentIntroduction = addDisplayBlockToImages(item.value as string)
                        } else if (item.key === 'ownFlag') {
                            data.trainSiteTwo.ownFlag = Number(item.value)
                        } else if (item.key === 'siteType') {
                            data.trainSiteTwo.siteType = Number(item.value)
                        } else if (item.key === 'siteVideo') {
                            //班别视频及展示图
                            const arr: fileProps[] = item.value as fileProps[]
                            const sitePic: classTagListInterface[] = []
                            const siteVideo: classTagListInterface[] = []
                            arr.forEach(item => {
                                if (item.type === 'video') {
                                    let cover = ''
                                    let video = ''
                                    let tag = ''
                                    item.list.forEach((list: fileListProps) => {
                                        console.log('list', list)
                                        if (list?.type === 'video') {
                                            video = list.key
                                            tag = list.name
                                        } else {
                                            cover = list.key
                                        }
                                    })
                                    siteVideo.push({
                                        cover,
                                        video,
                                        tag
                                    })
                                } else {
                                    item.list.forEach((list: fileListProps) => {
                                        sitePic.push({ pic: list.key, tag: list.name })
                                    })
                                }
                            })
                            data.trainSiteTwo.sitePic = sitePic
                            //驾校视频
                            data.trainSiteTwo.siteVideo = siteVideo
                        } else if (item.key === 'siteMating') {
                            data.trainSiteTwo.supportFacility = item.value as string[]
                        }
                    })
                }
            })
            this.threeFormData.forEach((child: PropsFormpData) => {
                if (Object.prototype.toString.call(child) === '[object Array]') {
                    const childList = child as formDataInterface[]
                    childList.forEach((item: formDataInterface) => {
                        console.log('threeRef', item)
                        if (item.key === 'addressDetail') {
                            data.trainSiteThree.addressDetail = item.value as string
                            const latLng = item.latLng as number[]
                            data.trainSiteThree.lat = Number(latLng[0])
                            data.trainSiteThree.lng = Number(latLng[1])
                            data.trainSiteThree.regionId = item.regionId as string
                        } else if (item.key === 'name') {
                            data.trainSiteThree.name = item.value as string
                        }
                    })
                }
            })
            if (this.operation.type === 'create') {
                createSite(data).then(res => {
                    if (Number(res.data.code) === 200) {
                        ElMessage.success('新增成功！')
                        this.routerStore.removeHeaderRoute(this.routerStore.selectIndex)
                        router.push('/siteManagement-list')
                    }
                })
            } else {
                data.trainSiteThree.id = this.operation.threeId
                data.trainSiteTwo.id = this.operation.twoId
                editSite(data).then(res => {
                    if (Number(res.data.code) === 200) {
                        ElMessage.success('修改成功！')
                        this.routerStore.removeHeaderRoute(this.routerStore.selectIndex)
                        router.push('/siteManagement-list')
                    }
                })
            }
        }
    }
}
